
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                <i class="icon iconfont icon-quancha"></i>
                    <div class="name">圈叉</div>
                    <div class="fontclass">.icon-quancha</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinggao1"></i>
                    <div class="name">分期－警告</div>
                    <div class="fontclass">.icon-jinggao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yinhang"></i>
                    <div class="name">银行</div>
                    <div class="fontclass">.icon-yinhang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-warning"></i>
                    <div class="name">警告</div>
                    <div class="fontclass">.icon-warning</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rili1"></i>
                    <div class="name">日历1</div>
                    <div class="fontclass">.icon-rili1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon-fujian"></i>
                    <div class="name">icon-附件</div>
                    <div class="fontclass">.icon-icon-fujian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon-shangchuan"></i>
                    <div class="name">icon-上传</div>
                    <div class="fontclass">.icon-icon-shangchuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon-canzhao"></i>
                    <div class="name">icon-参照</div>
                    <div class="fontclass">.icon-icon-canzhao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu2"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zengjia"></i>
                    <div class="name">增加</div>
                    <div class="fontclass">.icon-zengjia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-biangengjilu"></i>
                    <div class="name">变更记录</div>
                    <div class="fontclass">.icon-biangengjilu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daitiqu"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.icon-daitiqu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-Fill"></i>
                    <div class="name">Fill 1</div>
                    <div class="fontclass">.icon-Fill</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-Fill1"></i>
                    <div class="name">Fill 2</div>
                    <div class="fontclass">.icon-Fill1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantouzuo"></i>
                    <div class="name">箭头左</div>
                    <div class="fontclass">.icon-jiantouzuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantouyou"></i>
                    <div class="name">箭头右</div>
                    <div class="fontclass">.icon-jiantouyou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangchuan"></i>
                    <div class="name">上传</div>
                    <div class="fontclass">.icon-shangchuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-guanbi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-duoxuan123"></i>
                    <div class="name">多选2</div>
                    <div class="fontclass">.icon-duoxuan123</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-duoxuan1"></i>
                    <div class="name">多选1</div>
                    <div class="fontclass">.icon-duoxuan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantouxia1"></i>
                    <div class="name">箭头下</div>
                    <div class="fontclass">.icon-jiantouxia1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantoushang1"></i>
                    <div class="name">箭头上</div>
                    <div class="fontclass">.icon-jiantoushang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shibai"></i>
                    <div class="name">失败</div>
                    <div class="fontclass">.icon-shibai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tixing"></i>
                    <div class="name">提醒</div>
                    <div class="fontclass">.icon-tixing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wancheng"></i>
                    <div class="name">完成</div>
                    <div class="fontclass">.icon-wancheng</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhuyi1"></i>
                    <div class="name">注意</div>
                    <div class="fontclass">.icon-zhuyi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-bianji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qingkong"></i>
                    <div class="name">清空</div>
                    <div class="fontclass">.icon-qingkong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangchuanfujian"></i>
                    <div class="name">上传附件</div>
                    <div class="fontclass">.icon-shangchuanfujian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tianjiayingyong"></i>
                    <div class="name">添加应用</div>
                    <div class="fontclass">.icon-tianjiayingyong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gengduo"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-gengduo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinggao"></i>
                    <div class="name">警告</div>
                    <div class="fontclass">.icon-jinggao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shituliebiaoqiehuan"></i>
                    <div class="name">视图列表切换</div>
                    <div class="fontclass">.icon-shituliebiaoqiehuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shu_zk"></i>
                    <div class="name">树1</div>
                    <div class="fontclass">.icon-shu_zk</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-danxuan-xuanzhong"></i>
                    <div class="name">单选-选中</div>
                    <div class="fontclass">.icon-danxuan-xuanzhong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-danxuan-weixuan"></i>
                    <div class="name">单选-未选</div>
                    <div class="fontclass">.icon-danxuan-weixuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rili"></i>
                    <div class="name">日历</div>
                    <div class="fontclass">.icon-rili</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuaxin"></i>
                    <div class="name">刷新</div>
                    <div class="fontclass">.icon-shuaxin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhuxiao"></i>
                    <div class="name">注销</div>
                    <div class="fontclass">.icon-zhuxiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-quanbuyingyong"></i>
                    <div class="name">全部应用</div>
                    <div class="fontclass">.icon-quanbuyingyong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mianbaoxie"></i>
                    <div class="name">面包屑</div>
                    <div class="fontclass">.icon-mianbaoxie</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiaoxi"></i>
                    <div class="name">消息</div>
                    <div class="fontclass">.icon-xiaoxi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhuye"></i>
                    <div class="name">主页</div>
                    <div class="fontclass">.icon-zhuye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shezhi"></i>
                    <div class="name">设置</div>
                    <div class="fontclass">.icon-shezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kuaiguan-kai"></i>
                    <div class="name"> 快关-开</div>
                    <div class="fontclass">.icon-kuaiguan-kai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kaiguan-kai-jinyong"></i>
                    <div class="name">开关-开-禁用</div>
                    <div class="fontclass">.icon-kaiguan-kai-jinyong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kaiguan-guan2"></i>
                    <div class="name">开关-关</div>
                    <div class="fontclass">.icon-kaiguan-guan2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kaiguan-guan-jinyong"></i>
                    <div class="name">开关-关-禁用</div>
                    <div class="fontclass">.icon-kaiguan-guan-jinyong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shituqiehuan"></i>
                    <div class="name">视图切换2</div>
                    <div class="fontclass">.icon-shituqiehuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bangzhutishi"></i>
                    <div class="name">帮助提示</div>
                    <div class="fontclass">.icon-bangzhutishi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-loucengsuolvetu"></i>
                    <div class="name">楼层缩略图</div>
                    <div class="fontclass">.icon-loucengsuolvetu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-loucengtubiao"></i>
                    <div class="name">楼层图标</div>
                    <div class="fontclass">.icon-loucengtubiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangyiye"></i>
                    <div class="name">上一页</div>
                    <div class="fontclass">.icon-shangyiye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiayiye"></i>
                    <div class="name">下一页</div>
                    <div class="fontclass">.icon-xiayiye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenku"></i>
                    <div class="name">文库</div>
                    <div class="fontclass">.icon-wenku</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-toupiao"></i>
                    <div class="name">投票</div>
                    <div class="fontclass">.icon-toupiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rizhi"></i>
                    <div class="name">日志</div>
                    <div class="fontclass">.icon-rizhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xinzifafang"></i>
                    <div class="name">薪资发放</div>
                    <div class="fontclass">.icon-xinzifafang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gonggao"></i>
                    <div class="name">公告</div>
                    <div class="fontclass">.icon-gonggao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huati"></i>
                    <div class="name">话题</div>
                    <div class="fontclass">.icon-huati</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zuzhiguanli"></i>
                    <div class="name">组织管理</div>
                    <div class="fontclass">.icon-zuzhiguanli</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiaqin"></i>
                    <div class="name">假勤</div>
                    <div class="fontclass">.icon-jiaqin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qiehuanyou"></i>
                    <div class="name">切换右</div>
                    <div class="fontclass">.icon-qiehuanyou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianjiyou"></i>
                    <div class="name">点击右</div>
                    <div class="fontclass">.icon-dianjiyou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianjizuo"></i>
                    <div class="name">点击左</div>
                    <div class="fontclass">.icon-dianjizuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qiehuanzuo"></i>
                    <div class="name">切换左</div>
                    <div class="fontclass">.icon-qiehuanzuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fujianshenpi"></i>
                    <div class="name">附件（审批）</div>
                    <div class="fontclass">.icon-fujianshenpi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shenpiliucheng"></i>
                    <div class="name">审批流程</div>
                    <div class="fontclass">.icon-shenpiliucheng</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shenpitongguo"></i>
                    <div class="name">审批通过</div>
                    <div class="fontclass">.icon-shenpitongguo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shenpibohui"></i>
                    <div class="name">审批驳回</div>
                    <div class="fontclass">.icon-shenpibohui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yidu"></i>
                    <div class="name">已读</div>
                    <div class="fontclass">.icon-yidu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yewuchuli"></i>
                    <div class="name">业务处理</div>
                    <div class="fontclass">.icon-yewuchuli</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-liucheng"></i>
                    <div class="name">流程3</div>
                    <div class="fontclass">.icon-liucheng</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-liucheng1"></i>
                    <div class="name">流程2</div>
                    <div class="fontclass">.icon-liucheng1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tijiaoren"></i>
                    <div class="name">提交人</div>
                    <div class="fontclass">.icon-tijiaoren</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-liucheng2"></i>
                    <div class="name">流程1</div>
                    <div class="fontclass">.icon-liucheng2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-canzhao"></i>
                    <div class="name">参照</div>
                    <div class="fontclass">.icon-canzhao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gundongxiangxia"></i>
                    <div class="name">滚动向下</div>
                    <div class="fontclass">.icon-gundongxiangxia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu1"></i>
                    <div class="name">删除2</div>
                    <div class="fontclass">.icon-shanchu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-quxiao"></i>
                    <div class="name">取消</div>
                    <div class="fontclass">.icon-quxiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-queding"></i>
                    <div class="name">确定</div>
                    <div class="fontclass">.icon-queding</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xingzhuang"></i>
                    <div class="name">形状</div>
                    <div class="fontclass">.icon-xingzhuang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-Group"></i>
                    <div class="name">视图</div>
                    <div class="fontclass">.icon-Group</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-duplicate"></i>
                    <div class="name">duplicate</div>
                    <div class="fontclass">.icon-duplicate</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gear"></i>
                    <div class="name">gear</div>
                    <div class="fontclass">.icon-gear</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gongzuoliu"></i>
                    <div class="name">工作流</div>
                    <div class="fontclass">.icon-gongzuoliu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shenpixiangqing"></i>
                    <div class="name">审批详情</div>
                    <div class="fontclass">.icon-shenpixiangqing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hangcaozuoxiangshang1"></i>
                    <div class="name">行操作向上</div>
                    <div class="fontclass">.icon-hangcaozuoxiangshang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hangcaozuoxiala1"></i>
                    <div class="name">行操作下拉</div>
                    <div class="fontclass">.icon-hangcaozuoxiala1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenjianjia"></i>
                    <div class="name">文件夹</div>
                    <div class="fontclass">.icon-wenjianjia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenjianjiadakai"></i>
                    <div class="name">文件夹打开</div>
                    <div class="fontclass">.icon-wenjianjiadakai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangchuan1"></i>
                    <div class="name">上传2</div>
                    <div class="fontclass">.icon-shangchuan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-right"></i>
                    <div class="name">right</div>
                    <div class="fontclass">.icon-right</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bottom"></i>
                    <div class="name">bottom</div>
                    <div class="fontclass">.icon-bottom</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuwenjianshouqi"></i>
                    <div class="name">树文件收起</div>
                    <div class="fontclass">.icon-shuwenjianshouqi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuwenjianzhankai"></i>
                    <div class="name">树文件展开</div>
                    <div class="fontclass">.icon-shuwenjianzhankai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shushouqi"></i>
                    <div class="name">树展开</div>
                    <div class="fontclass">.icon-shushouqi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuaxin1"></i>
                    <div class="name">刷新</div>
                    <div class="fontclass">.icon-shuaxin1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zuixiaohua"></i>
                    <div class="name">最小化</div>
                    <div class="fontclass">.icon-zuixiaohua</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zuidahua"></i>
                    <div class="name">最大化</div>
                    <div class="fontclass">.icon-zuidahua</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-celashouqi"></i>
                    <div class="name">侧拉收起</div>
                    <div class="fontclass">.icon-celashouqi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fanhuishangyiji"></i>
                    <div class="name">返回上一级</div>
                    <div class="fontclass">.icon-fanhuishangyiji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guize"></i>
                    <div class="name">规则</div>
                    <div class="fontclass">.icon-guize</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kemu"></i>
                    <div class="name">科目</div>
                    <div class="fontclass">.icon-kemu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-duoxuan"></i>
                    <div class="name">多选2</div>
                    <div class="fontclass">.icon-duoxuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rili-jin"></i>
                    <div class="name">日历-今</div>
                    <div class="fontclass">.icon-rili-jin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kaishi1"></i>
                    <div class="name">开始</div>
                    <div class="fontclass">.icon-kaishi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shaixuan"></i>
                    <div class="name">筛选</div>
                    <div class="fontclass">.icon-shaixuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiangxu"></i>
                    <div class="name">降序</div>
                    <div class="fontclass">.icon-jiangxu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shengxu"></i>
                    <div class="name">升序</div>
                    <div class="fontclass">.icon-shengxu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuodong"></i>
                    <div class="name">拖动</div>
                    <div class="fontclass">.icon-tuodong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.icon-fenxiang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zanting"></i>
                    <div class="name">暂停</div>
                    <div class="fontclass">.icon-zanting</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-peizhi_up"></i>
                    <div class="name">peizhi_up</div>
                    <div class="fontclass">.icon-peizhi_up</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-peizhi_down"></i>
                    <div class="name">peizhi_down</div>
                    <div class="fontclass">.icon-peizhi_down</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-peizhi_tianjia"></i>
                    <div class="name">peizhi_tianjia</div>
                    <div class="fontclass">.icon-peizhi_tianjia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-peizhi_yixuan"></i>
                    <div class="name">peizhi_yixuan</div>
                    <div class="fontclass">.icon-peizhi_yixuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xx-chakanxiangqing"></i>
                    <div class="name">xx-查看详情</div>
                    <div class="fontclass">.icon-xx-chakanxiangqing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-chaxun-hanshu"></i>
                    <div class="name">查询-函数</div>
                    <div class="fontclass">.icon-chaxun-hanshu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yujing"></i>
                    <div class="name">预警</div>
                    <div class="fontclass">.icon-yujing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghuzu"></i>
                    <div class="name">用户组</div>
                    <div class="fontclass">.icon-yonghuzu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhankai"></i>
                    <div class="name">展开</div>
                    <div class="fontclass">.icon-zhankai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shouqi"></i>
                    <div class="name">收起</div>
                    <div class="fontclass">.icon-shouqi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yewudanyuan"></i>
                    <div class="name">业务单元</div>
                    <div class="fontclass">.icon-yewudanyuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bumen"></i>
                    <div class="name">部门</div>
                    <div class="fontclass">.icon-bumen</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jituan"></i>
                    <div class="name">集团</div>
                    <div class="fontclass">.icon-jituan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xuzuzhi"></i>
                    <div class="name">虚组织</div>
                    <div class="fontclass">.icon-xuzuzhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shenpiyushezhi"></i>
                    <div class="name">审批语设置</div>
                    <div class="fontclass">.icon-shenpiyushezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-morenshezhi"></i>
                    <div class="name">默认设置</div>
                    <div class="fontclass">.icon-morenshezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jituancaiwuhebing"></i>
                    <div class="name">集团财务合并</div>
                    <div class="fontclass">.icon-jituancaiwuhebing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dailirenshezhi"></i>
                    <div class="name">代理人设置</div>
                    <div class="fontclass">.icon-dailirenshezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-changyongshuju"></i>
                    <div class="name">常用数据</div>
                    <div class="fontclass">.icon-changyongshuju</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-danticaiwubaobiao"></i>
                    <div class="name">单体财务报表</div>
                    <div class="fontclass">.icon-danticaiwubaobiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jituanbaobiao"></i>
                    <div class="name">集团报表</div>
                    <div class="fontclass">.icon-jituanbaobiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang1"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.icon-fenxiang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shezhi1"></i>
                    <div class="name">设置</div>
                    <div class="fontclass">.icon-shezhi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gerenpeizhi"></i>
                    <div class="name">个人配置</div>
                    <div class="fontclass">.icon-gerenpeizhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhanghushezhi"></i>
                    <div class="name">账户设置</div>
                    <div class="fontclass">.icon-zhanghushezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-saoyisao"></i>
                    <div class="name">扫一扫</div>
                    <div class="fontclass">.icon-saoyisao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rilizuixin"></i>
                    <div class="name">日历最新</div>
                    <div class="fontclass">.icon-rilizuixin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-canzhaozuixin"></i>
                    <div class="name">参照最新</div>
                    <div class="fontclass">.icon-canzhaozuixin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zanwufangan"></i>
                    <div class="name">暂无方案</div>
                    <div class="fontclass">.icon-zanwufangan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuding"></i>
                    <div class="name">图钉</div>
                    <div class="fontclass">.icon-tuding</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-luzhi"></i>
                    <div class="name">录制</div>
                    <div class="fontclass">.icon-luzhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zuzhi"></i>
                    <div class="name">组织</div>
                    <div class="fontclass">.icon-zuzhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-luzhizhong"></i>
                    <div class="name">录制中</div>
                    <div class="fontclass">.icon-luzhizhong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhengbiaobianji"></i>
                    <div class="name">整表编辑2</div>
                    <div class="fontclass">.icon-zhengbiaobianji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhengbiaobianji1"></i>
                    <div class="name">整表编辑1</div>
                    <div class="fontclass">.icon-zhengbiaobianji1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qiehuanyt"></i>
                    <div class="name">切换yt</div>
                    <div class="fontclass">.icon-qiehuanyt</div>
                </li>
            
        </ul>

        <h2 id="font-class-">font-class引用</h2>
        <hr>

        <p>font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。</p>
        <p>与unicode使用方式相比，具有如下特点：</p>
        <ul>
        <li>兼容性良好，支持ie8+，及所有现代浏览器。</li>
        <li>相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。</li>
        <li>因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。</li>
        <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的fontclass代码：</h3>


        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;link rel="stylesheet" type="text/css" href="./iconfont.css"&gt;</span></code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-css hljs">&lt;<span class="hljs-selector-tag">i</span> <span class="hljs-selector-tag">class</span>="<span class="hljs-selector-tag">iconfont</span> <span class="hljs-selector-tag">icon-xxx</span>"&gt;&lt;/<span class="hljs-selector-tag">i</span>&gt;</code></pre>
        <blockquote>
        <p>"iconfont"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。</p>
        </blockquote>
    </div>
</body>
</html>
